import Vue from 'vue'
import VueRouter from 'vue-router'
import Main from '../views/Main.vue'

import CategoriesCreate from '../views/CategoriesEdit.vue'
import CategoriesList from '../views/CategoriesList.vue'

import ItemsEdit from '../views/ItemsEdit.vue'
import ItemsList from '../views/ItemsList.vue'

import HeroesEdit from '../views/HeroesEdit.vue'
import HeroesList from '../views/HeroesList.vue'

import ArticleEdit from '../views/ArticleEdit.vue'
import ArticleList from '../views/ArticleList.vue'

import AdvEdit from '../views/AdvEdit.vue'
import AdvList from '../views/AdvList.vue'

import AdminUsersEdit from '../views/AdminUsersEdit.vue'
import AdminUsersList from '../views/AdminUsersList.vue'

import Login from '../views/Login.vue'
Vue.use(VueRouter)

const routes = [

  {
    path: '/admin',
    name: 'Main',
    component: Main,
    children: [
      {
        path: '/categories/create',
        name: 'catecreate',
        component: CategoriesCreate
      },
      {
        path: '/categories/list',
        name: 'catelist',
        component: CategoriesList
      },
      {
        path: '/categories/edit/:id',
        name: 'cateedit',
        //跳转到Edit组件，一组件多用
        component: CategoriesCreate,
        //开启props，这样就能通过props的形式接收到id的值了
        props: true
      },
      { path: '/items/create', name: 'itemscreate', component: ItemsEdit },
      { path: '/items/list', name: 'itemslist', component: ItemsList },
      { path: '/items/edit/:id', name: 'itemsedit', component: ItemsEdit, props: true },

      { path: '/heroes/create', name: 'heroescreate', component: HeroesEdit },
      { path: '/heroes/list', name: 'heroeslist', component: HeroesList },
      { path: '/heroes/edit/:id', name: 'heroesedit', component: HeroesEdit, props: true },

      { path: '/articles/create', name: 'articlescreate', component: ArticleEdit },
      { path: '/articles/list', name: 'articleslist', component: ArticleList },
      { path: '/articles/edit/:id', name: 'articlesedit', component: ArticleEdit, props: true },

      { path: '/advs/create', name: 'advscreate', component: AdvEdit },
      { path: '/advs/list', name: 'advslist', component: AdvList },
      { path: '/advs/edit/:id', name: 'advsedit', component: AdvEdit, props: true },

      { path: '/adminusers/create', name: 'adminuserscreate', component: AdminUsersEdit },
      { path: '/adminusers/list', name: 'adminuserslist', component: AdminUsersList },
      { path: '/adminusers/edit/:id', name: 'adminusersedit', component: AdminUsersEdit, props: true }

    ]
  },


  {
    path: '/',  
    name: 'AdminLogin',
    component:Login,
    //用meta参数存储用于分辨的数据
    meta:{isPubilsh:true}
  },

]


const router = new VueRouter({
  routes
})

//路由前置守卫，挂载在VueRouter实例上面
//参数（to:跳转到哪个页面,form:从哪个页面跳转）
router.beforeEach((to,form,next)=>{
  //next()为跳转操作 | 默认next()为跳转到to页面 | (false)为终止操作
  //进行限制:只要没有isPublish(只有登录界面有) 或者 token(只有登录成功了才有) 就跳转到登录页面—对前端页面进行限制
  if(!to.meta.isPubilsh && !sessionStorage.token)
  {
    next('/')
  }
  next()
})

export default router
